import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui'
import SearchBox from './components/SearchBox.vue'
import 'element-ui/lib/theme-chalk/index.css'
import WebSocketPlugin from './plugins/websocket'
import VForm from 'vform-builds'

import 'element-ui/lib/theme-chalk/index.css' // Element UI 样式
import 'vform-builds/dist/VFormDesigner.css' // VForm 设计器样式[1,6,8](@ref)

Vue.config.productionTip = false

Vue.use(VForm)
Vue.config.productionTip = false

Vue.component('SearchBox', SearchBox)
Vue.use(ElementUI)
Vue.use(WebSocketPlugin)

// 在创建Vue实例前，先初始化认证状态
console.log('创建Vue实例前初始化认证状态');

// 检查是否有保存的用户名
const savedUsername = localStorage.getItem('lastLoggedInUser');
console.log('从localStorage获取保存的用户名:', savedUsername || '无');

// 如果有保存的用户名，先设置用户名，再初始化认证状态
if (savedUsername) {
  console.log('初始化认证前设置用户名');
  store.commit('setMyName', savedUsername);
}

// 初始化认证状态
store.dispatch('initAuth');

// 输出初始化后的认证状态
console.log('初始化后的认证状态:', {
  已登录: store.getters.isLoggedIn,
  用户名: store.state.myName,
  有Token: !!store.state.Authorization
});

// 添加全局导航守卫，检查认证状态
// 全局导航守卫
router.beforeEach((to, from, next) => {
  console.log(`导航：从 ${from.path} 到 ${to.path}`);
  
  // 检查是否是从登录页重定向到主页或管理员页
  const isRedirectFromLogin = from.path === '/login' && 
    (to.path.startsWith('/Main') || to.path.startsWith('/admin'));
  
  // 检查路由是否需要认证
  // 1. 通过meta.requiresAuth属性
  // 2. 或者路径以/Main或/admin开头
  const requiresAuth = to.matched.some(record => record.meta.requiresAuth) || 
    to.path.startsWith('/Main') || to.path.startsWith('/admin');
  
  if (requiresAuth) {
    console.log('路由需要认证，检查登录状态');
    
    // 如果是从登录页重定向，直接放行，避免循环重定向
    if (isRedirectFromLogin) {
      console.log('从登录页重定向，直接放行');
      return next();
    }
    
    // 检查用户是否已登录
    if (!store.getters.isLoggedIn) {
      console.log('用户未登录，重定向到登录页面');
      // 未登录则重定向到登录页
      return next({
        path: '/login',
        query: { redirect: to.fullPath }
      });
    } else {
      console.log('用户已登录，允许访问受保护路由');
      // 已登录则允许访问
      return next();
    }
  } else {
    console.log('路由不需要认证，允许访问');
    // 不需要认证的路由直接放行
    return next();
  }
});

new Vue({
  store,
  router,
  render: h => h(App)
}).$mount('#app')
